﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Mapa.Master" Inherits="System.Web.Mvc.ViewPage<List<object>>" %>

<%@ Import Namespace="zeus.Web.Controllers" %>
<%@ Import Namespace="Webdiyer.WebControls.Mvc" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContentPlaceHolder" runat="server">
    <table width="60%" border="0" cellspacing="2" cellpadding="2" class="datatable">
        
        <% foreach (var item in Model)
           {
                           
        %>
        <tr style="display:none;">
            <td id="dato">
                <%= Html.Encode(item) %>
            </td>
        </tr>
        <% } %>
    </table>
    
    

    
                <div id="map_canvas" style="width: 100%; height: 100%">
                </div>
            
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="HeadContentPlaceHolder" runat="server">
    
    <script type="text/javascript" src="<%= ResolveUrl("~") %>Content/Mapa/dragzoom.js" ></script>

    <script type="text/javascript">
      

    function initialize2() {
            if (GBrowserIsCompatible()) {
                map = new GMap2(document.getElementById("map"));

                if( points.length > 0 )
                    map.setCenter(new GLatLng(latCenter, lngCenter), zoom);
                else
                    map.setCenter(new GLatLng(-0.201015, -78.493537), 6);

                // map.addControl(new GLargeMapControl());
                map.setUIToDefault();
                map.enableRotation();
                map.addControl(new GMapTypeControl());
                map.clearOverlays();
                featureTable_ = document.getElementById("featuretbody");
            }
        }
    function initialize() {

        //alert($("#dato").text());
        var id;
        id = $("#dato").text();

        //alert(id);
        $.ajax({
                url: '<%= ResolveUrl("~") %>Mapa/MapaUbicacion',
                cache: false,
                data: 'id=' + id,
                type: 'POST',
                success: function (data) {

                    //alert(data[0]);
                  
                    if (GBrowserIsCompatible()) {
                        var map = new GMap2(document.getElementById("map_canvas"));
                        //map.setCenter(new GLatLng(latCenter, lngCenter), zoom);//poligono
                        map.setMapType(G_HYBRID_MAP);
                        map.addMapType(G_SATELLITE_3D_MAP);
                         map.addControl(new DragZoomControl());
                        geocoder = new GClientGeocoder();

                        var baseIcon = new GIcon();
                        baseIcon.iconSize = new GSize(40, 60);
                        baseIcon.shadowSize = new GSize(40, 60);
                        baseIcon.iconAnchor = new GPoint(40, 60);
                        baseIcon.infoWindowAnchor = new GPoint(16, 0);
                                               
                        var sentido;

                        if(data[6]==0)
                        {
                            sentido = "N";
                            
                            if (data[5]>5)
                            {
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png", null, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png");
                            }
                            else if(data[7]!=1)
                            {
                            
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png", null, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png");
                            
                            }
                            else
                            {
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png", null, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png");
                            }
                        }
                        
                        if ((data[6]>0) && (data[6]<90))
                        {
                            
                            sentido="NE";

                            if (data[5]>5)
                            {
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png", null, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png");
                            }
                             else if(data[7]!=1)
                            {
                            
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png", null, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png");
                            
                            }
                            else
                            {
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png", null, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png");
                            }
                        }
                        if(data[6]==90)
                        {
                        
                            sentido="E";
                            if (data[5]>5)
                            {
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png", null, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png");
                            }
                             else if(data[7]!=1)
                            {
                            
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png", null, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png");
                            
                            }
                            else
                            {
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png", null, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png");
                            }
                        }
                        if((data[6]>90) && (data[6]<180))
                        {
                        
                         sentido="SE";   
                         if (data[5]>5)
                         {
                            var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png", null, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png");
                         }
                          else if(data[7]!=1)
                            {
                            
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png", null, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png");
                            
                            }
                         else
                         {
                            var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png", null, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png");
                          }  
                        }
                        if(data[6]==180)
                        {
                        
                        sentido="S";
                         if (data[5]>5)
                         {
                            var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png", null, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png");
                        }
                         else if(data[7]!=1)
                            {
                            
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png", null, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png");
                            
                            }
                         else
                         {
                            var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png", null, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png");
                          }
                        }
                        if((data[6]>180) && (data[6]<270))
                        {
                        
                         sentido="SW";   
                         if (data[5]>5)
                         {
                            var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png", null, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png");
                         }
                         else if(data[7]!=1)
                            {
                            
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png", null, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png");
                            
                            }
                         else
                         {
                            var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png", null, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png");
                         }
                        }
                        if(data[6]==270)
                        {
                        
                        sentido="W";
                         if (data[5]>5)
                         {
                            var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png", null, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png");
                        }
                         else if(data[7]!=1)
                            {
                            
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png", null, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png");
                            
                            }
                         else
                         {
                            var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png", null, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png");
                            }
                        }
                        if((data[6]>270) && (data[6]<360))
                        {
                        
                         sentido="NW";   
                         if (data[5]>5)
                         {
                            var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png", null, "<%= ResolveUrl("~") %>Content/Images/cars/Encendido.png");
                         }
                          else if(data[7]!=1)
                            {
                            
                                var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png", null, "<%= ResolveUrl("~") %>Content/Images/emerFlecha/Emergencia.png");
                            
                            }
                         else
                         {
                            var flecha = new GIcon(baseIcon, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png", null, "<%= ResolveUrl("~") %>Content/Images/stopFlecha/Stop.png");
                         }
                        }

                        var center = new GLatLng(data[0], data[1]);
                        map.setCenter(center, 18);
                        var marker = new GMarker(center,flecha);
                        map.setUIToDefault();
                        map.enableRotation();
                        map.addControl(new GNavLabelControl(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(0, 0)));
                        map.addOverlay(marker);
                       


                        marker.openInfoWindowHtml("<b style='color: #0000FF'>ULTIMA UBICACION VALIDA</b><br/><b>Alias: </b><i>" + data[3] + "</i><br/><b>Placa: </b><i>" + data[4] + "</i><br/><b>Fecha/Hora: </b><i>" + data[2] + "</i><br/><b>Velocidad: </b><i>" + data[5] +" " +"Kph</i><br/><b>Sentido: </b><i>(" + data[6] + ")"+sentido+"</i><br/><b>Evento: </b><i>" + data[8] + "</i><br/><a href='../Mapa/BusquedaPorPosicion'>Ubicacion</a><br/><a href='../Mapa/BusquedaPorPosicion'>Sensores I/O</a>");
                        GEvent.addListener(marker, "click", function () {
                            marker.openInfoWindowHtml("<b style='color: #0000FF'>ULTIMA UBICACION VALIDA</b><br/><b>Alias: </b><i>" + data[3] + "</i><br/><b>Placa: </b><i>" + data[4] + "</i><br/><b>Fecha/Hora: </b><i>" + data[2] + "</i><br/><b>Velocidad: </b><i>" + data[5] +" " +"Kph</i><br/><b>Sentido: </b><i>(" + data[6] + ")"+sentido+"</i><br/><b>Evento: </b><i>" + data[8] + "</i><br/><a href='../Mapa/BusquedaPorPosicion'>Ubicacion</a><br/><a href='../Mapa/BusquedaPorPosicion'>Sensores I/O</a>");
                        });
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    $("#error").html(XMLHttpRequest.responseText);
                }
            });

    }

        $(window).load(function () {
             initialize();
             //retrievePoints();  
            

//             if(points.length > 0)
//            {
//                var color = getColor(false);
//                var poly = new GPolygon(points, color, 2, 0.7, color, 0.2);
//                map.addOverlay(poly);                
//            }
        });

        $(window).unload(function () {
            GUnload();
        });

        function prueba() {
        
            var contenido = document.getElementById('dato').innerHTML;

            alert(contenido);
        
        }

        function retrievePoints() {
            var id;
        id = $("#dato").text();

            $.ajax({
                type: "POST",
                url: "<%= ResolveUrl("~") %>Mapa/RetrievePoints",
                data: "id="+id,
                dataType: "json",
                async: false,
                cache: false,
                success: function (response) {
                alert(response);
                   $.each(response, function(i, data) {
                       var p = new GLatLng(data.Latitud, data.Longitud);
                       zoom = data.Zoom;
                        alert(zoom);
                       latCenter = data.LatCenter;
                       lngCenter = data.LngCenter;
                       points.push(p);
                      
                   });
                   var color = getColor(false);
                   var poly = new GPolygon(points, color, 2, 0.7, color, 0.2);
                   map.addOverlay(poly);  
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert(XMLHttpRequest.responseText);
                }
            });
        }
    
    </script>
</asp:Content>
